<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>图片传输</title>
  <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <link rel="stylesheet" href="../css/mui.min.css" />
  <script src="../js/mui.min.js"></script>
  <!--App自定义的css-->
  <link rel="stylesheet" type="text/css" href="../css/app.css" />
  <link rel="stylesheet" href="../npl/css/vant.mini.css" />
  <script src="../js/jquery-3.6.0.min.js"></script>
  <script src="../js/flexible.js"></script>
  <script src="../js/vue.js"></script>
  <script src="../js/sm2.js"></script>
  <script src="../js/sm3.js"></script>
  <!-- <script src="../js/feedback.js"></script> -->
  <script src="../js/vconsole.min.js"></script>
  <script src="../npl/js/vant.mini.js"></script>
  <script src="./text.js"></script>

  <style type="text/css">
    html,
    body,
    #app {
      overflow: hidden;
      background: none !important;
    }

    .back_r {
      width: 48px;
      height: 28px;
    }

    /* WebKit browsers */

    ::-webkit-input-placeholder {
      color: #d8e6fe;
    }

    /* Mozilla Firefox 4 to 18 */

    :-moz-placeholder {
      color: #d8e6fe;
      opacity: 1;
    }

    /* Mozilla Firefox 19+ */

    ::-moz-placeholder {
      color: #d8e6fe;
      opacity: 1;
    }

    /* Internet Explorer 10+ */

    :-ms-input-placeholder {
      color: #d8e6fe;
    }

    .mui-toast-container {
      top: 50%;
    }

    .trainTicketstitle {
      height: 2.5rem;
    }

    .header_text {
      min-height: 0.5rem;
      position: relative;
      /* margin-top: -42.5px; */
      background: url("../image/back-2.png") no-repeat center;
      background-size: 100% 100%;
    }

    .header_upload {
      /* height: 2.8rem; */
      max-height: 9rem;
      position: relative;
      margin-top: 8px;
      /* background: url("../image/back-2.png") no-repeat center; */
      background-size: 100% 110%;
      overflow: hidden;
      box-sizing: border-box;
    }

    .left {
      text-align: center;
    }

    .left a {
      line-height: 0.5rem;
      color: rgb(30, 55, 84);
    }

    .left .left1 {
      position: absolute;
      left: 0.1rem;
      top: 0.25rem;
    }

    .left :nth-child(1) span {
      line-height: 0.5rem;
      color: #fff;
    }

    .left :nth-child(2) span {
      line-height: 0.5rem;
      color: #fff;
    }

    .wrapper {
      margin-top: -40px;
      padding: 0 10px 10px;
      /* height: calc(100% - 100px); */
      overflow: scroll;
      position: relative;
      box-sizing: border-box;
    }

    .wrapper_upload {
      /* background: url(../image/back-2.png) no-repeat center; */
    }

    .text_title {
      /* height: 30px; */
      /* padding: 0% 0% 0% 4%; */
      position: relative;
      /* border-bottom: 1px solid #8a9dbe; */
      /* background:turquoise; */
      /* line-height: 30px;         */
    }

    .first_span {
      width: 3px;
      border-radius: 20% 20%;
      display: inline-block;
      height: 15px;
      background: #4294f1;
    }

    .first_span_text {
      font-weight: 500;
      font-size: 15px;
      color: #1e3754;
      /* position: absolute; */
      /* left: 7%; */
      /* top: 11%; */
    }

    .first_span_img {
      /* position: absolute;
        left: 25%;
        top: 36%; */
      margin-left: 3px;
      color: red;
    }

    .upload_wrapper {
      width: 96%;
      margin: auto;
      margin-top: 8px;
      padding-left: 8px;
      overflow-y: scroll;
      padding: 5px 0px 0;
      box-sizing: border-box;
      padding-bottom: 12px;
    }

    .List_wrapper {
      width: 95%;
      /* height: calc(3.5rem - 55px); */
      margin: auto;
      display: flex;
      flex-wrap: wrap;
      padding: 0px 5px 12px;
      justify-content: space-around;
    }

    .List {
      width: 45%;
      height: 34px;
      border: 2px solid #d3e3fe;
      font-weight: 500;
      color: #8a9dbe;
      border-radius: 4px;
      padding-left: 1%;
      padding-top: 1.2%;
      margin-top: 4px;
    }

    .List_img {
      width: 14px;
      height: 14px;
      display: inline-block;
      margin-bottom: 5px;
    }

    /* 点击之后的样式 */

    .upload_img {
      /* width: 44%; */
      width: 25vw;
      height: calc(34vw * 3 / 4);
      /* width: 120px; */
      /* border: #50a7f4 0.25px dashed; */
      /* height: 120px; */
      /* padding: 20px; */
      /* background: #ffffff; */
      /* border-radius: 8px; */
      /* border: 1px dashed #bcbebe; */
      display: flex;
      flex-direction: column;
      /* justify-content: space-around; */
      align-items: center;
      padding: 2px;
      position: relative;
      margin-top: 8px;
      /* margin-bottom: 10px; */
      float: left;
      box-sizing: border-box;
      background: url("../image/bg-3.png") no-repeat;
      background-size: 100% 100%;
    }

    .upload_img:nth-child(3n+2) {
      margin-right: 5%;
      margin-left: 5%;
    }

    .img_active {
      width: 28%;
      height: 80px;
      /* padding: 20px; */
      background: #ffffff;
      border-radius: 8px;
      opacity: 0;
    }

    .quxiao {
      position: absolute;
      right: -8%;
      top: -5%;
      display: block;
      width: 20%;
      height: 20%;
    }

    .chenggong {
      position: absolute;
      left: 38%;
      bottom: -6%;
      display: block;
      width: 28%;
      height: 20%;
    }

    .upimg {
      margin-top: 10px;
      width: 36px;
      height: 30px;
      background: url("../image/bg-1.png") no-repeat;
      background-size: 100% 100%;
    }

    .up_text {
      font-weight: 500;
      font-size: 12px;
      color: #969799;
    }

    .inp {
      display: inline-block;
    }

    input[type="text"] {
      width: 250px;
      height: 50px;
      margin-bottom: 0;
    }

    .home {
      border: none;
    }

    .my {
      border: none;
    }

    .text_wrapper {
      width: 90%;
      margin: auto;
      margin-top: 10px;
      height: calc(2.5rem - 55px);
      display: flex;
      justify-content: space-between;
      padding: 10px 4px 0 0;
      border-top: 1px dashed #cacfcf;
    }

    .text_wrapper_site {
      width: 90%;
      margin: auto;
      margin-top: 5px;
      height: calc(2.5rem - 55px);
      display: flex;
      justify-content: space-between;
      padding: 0 4px 0 0;
    }

    #input {
      width: 80%;
      height: 90%;
    }

    .voice_btn {
      /* display: inline; */
      width: 60px;
      height: 50px;
      text-align: center;
      line-height: 67px;
      background: #f7faff;
      border-radius: 8px;
      margin-left: 5px;
      /* margin-top: 2%; */
    }

    .site_btn {
      width: 50px;
      height: 50px;
      text-align: center;
      line-height: 60px;
      background: #f7faff;
      border-radius: 8px;
      margin-left: 5px;
    }

    .site_img {
      display: inline;
      width: 40%;
      height: 46%;
    }

    .voice_img {
      display: inline;
      width: 35%;
      height: 55%;
    }

    .clipboardContent {
      font-size: 12px;
      margin-bottom: 0;
      padding: 5px;
    }

    .clipboardContent_site {
      font-size: 12px;
      height: 40px;
      margin-bottom: 0;
      line-height: 16px;
      margin-top: 4px;
      border: none;
      height: 46px;
      padding: 22px 0 0;
      border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    }

    .titleInput {
      outline: 0;
      -web-kit-appearance: none;
      -moz-p: none;
      font-size: 0.32rem;
      /* height: 0.5rem; */
      border-radius: 4px;
      /* border: 1px solid #d8e6fe; */
      border: none !important;
      border-bottom: 1px solid #d8e6fe !important;
      /* width: 100%; */
      margin-bottom: 0.2rem;
      -webkit-user-select: auto;
      background-color: transparent !important;
      -moz-user-select: auto;
      background-image: linear-gradient(to right,
          rgb(13, 121, 131),
          rgb(25, 179, 182)) !important;
      color: #fff;
      margin: 0 auto;
      width: 100%;
      text-align: center;
      padding: 0.3rem 0.1rem;
    }

    .texts {
      margin: 0.1rem 0rem 0 8px;
      /* color: rgba(95, 132, 247, 1); */
      color: rgb(185, 196, 216);
      font-weight: 600;
    }

    .foot {
      position: fixed;
      bottom: 10px;
      left: 0px;
      padding: 10px;
      width: 100%;
    }

    .foot .title_slot {
      display: flex;
      align-items: center;
    }

    .foot .title_slot img {
      width: 34px;
      height: 34px;
      margin-right: 6px;
    }

    .foot .title_slot .title_slot_text {
      display: flex;
      flex-direction: column;
    }

    .foot .title_slot .title_slot_text span:nth-child(2) {
      font-size: 10px;
      line-height: 10px;
      color: #999999;
    }

    .foot .title_slot .title_slot_text span:nth-child(1) {
      font-size: 14px;
      line-height: 14px;
      margin-bottom: 4px;
    }

    .del_btn1 {
      width: 45%;
      height: 40px;
      /* box-shadow: 0px 16px 16px 0px rgba(4, 124, 137, 0.05); */
      /* border-radius: 8px; */
      background-color: rgba(45, 52, 60, 0.07);
      border-radius: 48px;
      color: rgba(45, 52, 60, 0.8);
      font-size: 16px;
      font-family: PingFang SC;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
    }

    .del_btn2 {
      width: 45%;
      height: 40px;
      background-color: #19aeb0;
      border-radius: 48px;
      color: #fff;
      font-weight: 600;
    }

    /*  */

    .van-uploader__preview-image {
      width: 100%;
      height: 110px;
    }

    .van-uploader__preview {
      width: 45%;
      margin: 0;
      margin: 0 2% 3% 0;
    }

    .van-uploader__wrapper {
      display: flex;
    }

    .van-uploader {
      width: 100%;
      padding: 0 0 0 3%;
    }

    .van-uploader__mask {
      width: 100%;
    }

    .van-uploader__upload-icon {
      /* width: 36px;
            height: 30px; */
    }

    .van-uploader__upload-icon img {
      width: 100%;
      height: 100%;
    }

    .van-uploader__upload {
      width: 38vw;
      height: calc(50vw * 3 / 4);
      border: #50a7f4 1px dashed;
      border-radius: 8px;
      /* border: 1px dashed #bcbebe; */
      margin: 0 8px 0px 4px;
      background: url("../image/bg-3.png") no-repeat;
      background-size: 100% 100%;
      /* background: none !important; */
    }

    .numImg {
      display: flex;
      margin-top: 10px;
      color: rgba(45, 52, 60, 0.6);
      font-size: 14px;
      margin-left: 10px;
    }

    .header_upload1 {
      padding: 0 24px;
      /* height: 2.8rem; */
      position: relative;
      margin-top: -70px;
    }

    .upload_wrapper1 {
      width: 100%;
      /* max-height: calc(2.7rem - 27px); */
      margin: auto;
      /* padding-left: 8px; */
      overflow-y: scroll;
      /* padding: 5px 0px 0; */
      /* margin: 10px 0 0 10px; */
    }

    .upload_img1:nth-child(3n-1) {
      margin-right: 5%;
      margin-left: 5%;
    }

    .img_active1 {
      width: 28%;
      height: 80px;
      /* padding: 20px; */
      background: #ffffff;
      border-radius: 8px;
      opacity: 0;
    }

    .quxiao1 {
      position: absolute;
      right: -8%;
      top: -6%;
      display: block;
      width: 18%;
      height: 19%;
    }

    .chenggong1 {
      position: absolute;
      left: 38%;
      bottom: -6%;
      display: block;
      width: 28%;
      height: 20%;
    }

    .upimg1 {
      margin-top: 10px;
      width: 32px;
      height: 26px;
      background: url("../image/jia.png") no-repeat;
      background-size: 100% 100%;
    }

    .up_text1 {
      font-weight: 500;
      font-size: 12px;
      color: #8a9dbe;
    }

    .upload_img:after {
      content: "";
      position: absolute;
      top: -50%;
      bottom: -50%;
      left: -50%;
      right: -50%;
      border: #50a7f4 1px dashed;
      -webkit-transform: scale(0.5);
      transform: scale(0.5);
    }
    .van-nav-bar__title {
      /* width: 100px; */
      flex:1;
      display: flex;
      justify-content: flex-start ;
      /* margin-left: 2rem; */
    }
.header_tit .van-nav-bar__left, .header_tit .van-nav-bar__right{
  position: static !important;
  text-align: left; /* 直接让文字左对齐（最直接的偏左方式） */
  margin-left: 0;

}
  </style>
</head>

<body>
  <div id="app" v-cloak>
    <div class="is-loading">
      <div class="curtain">
        <div class="loadingBgc">
          <div class="loader"></div>
        </div>
      </div>
    </div>
    <div class="trainTicketstitle">
      <div class="header_tit">
        <van-nav-bar title="拍一拍" left-arrow>
          <template #left>
            <div class="back_l" @click="home">
              <img src="../image/left.png" alt="" />
            </div>
          </template>
          <template #right>
            <div class="back_r" style="margin-right:-3px" @click="sendEmail(0)">
              <img src="../image/youx.png" alt="" />
            </div>
            <div class="back_r" @click="sendEmail(3)">
              <img src="../image/tb.png" alt="" />
            </div>
          </template>
        </van-nav-bar>
      </div>
    </div>
    <div class="header_upload1">
      <div class="text_title">
        <span class="first_span" style="margin-top: 5px"></span>
        <span class="first_span_text"><span>上传图片</span><span class="first_span_img">*</span><br />
          <span class="numImg">最多上传9张图片，每张不超过10MB</span>
        </span>
      </div>
      <div class="upload_wrapper1">
        <div class="upload_img" v-for="(item, index) in addedPreviewFile">
          <img :src="item.localDatas" style="width: 100%; height: 100%" alt="" ref="img" v-if="addedPreviewFile" />
          <img @click="delImg(index)" v-if="addedPreviewFile" class="quxiao" src="../image/quxiao1.png" alt="" />
        </div>
        <div class="upload_img" @click="functionBtn" v-if="addedPreviewFile.length < 9">
          <input type="file" id="inputer" class="file-input4 file-input" style="display: none; width: 28%; height: 100%"
            ref="inputer" />
        </div>
      </div>

    </div>
    <div class="foot">
      <van-divider :style="{ padding: '0 16px' }" hairline></van-divider>
      <van-cell center>
        <template #title>
          <div class="title_slot">
            <img src="../image/icon-3.png" alt="" />
            <div class="title_slot_text">
              <span>添加坐标</span>
              <span>添加当前位置经纬度</span>
            </div>
          </div>
        </template>
        <template #right-icon>
          <van-switch :disabled="showDis" @change="isLocationChange" active-color="#4294F1" v-model="isLocation"
            size="24" />
        </template>
      </van-cell>
      <van-cell center>
        <template #title>
          <div class="title_slot">
            <img src="../image/icon-2.png" alt="" />
            <div class="title_slot_text">
              <span>添加水印</span>
              <span>水印格式：组织机构-姓名-日期</span>
            </div>
          </div>
        </template>
        <template #right-icon>
          <van-switch :disabled="showDis" active-color="#4294F1" v-model="isWatermark" size="24" />
        </template>
      </van-cell>
      <van-cell center>
        <template #title>
          <div class="title_slot">
            <img src="../image/icon-1.png" alt="" />
            <div class="title_slot_text">
              <span>图片合并生成PDF文件</span>
            </div>
          </div>
        </template>
        <template #right-icon>
          <van-switch :disabled="showDis" active-color="#4294F1" v-model="isPdf" size="24" />
        </template>
      </van-cell>
    </div>
  </div>
  <script>
    new Vue({
      el: "#app",
      data() {
        return {
          isflageIOX: false,
          addedPreview: [], // 临时存储
          addedPreviewFile: [], // 最终存储
          addedPreviewFileIds: [],
          slocalResPath: [],
          localIds: [],
          // disabled: false,
          picUserNum: 0,
          batchId: "", //标识图片是否是同一批数据,
          id: null,
          multiple: true,
          // userDocid: null,
          formData: [],
          num: 0,
          isWatermark: false,
          isPdf: false,
          isLocation: false,
          coord: "",
        };
      },
      created() {
        const _this = this;
        _this.compatibleInput();
        let jsApiList = [];
        $.getScript("../js/jweixin-sgccigw-1.0.0.js" /*"js/jweixin-1.0.0.js"*/ , function () {
          "use strict";
          wx.ready(function () {
            console.log(777)
            wx.onHistoryBack(() => {
              _this.home();
              return false;
            });
          });
          jsApiList = [
            "getLocation",
            "onHistoryBack",
            "chooseImage",
            "getLocalImgData",
            "previewImage",
            "uploadImage",
            "downloadImage",
            "previewFile",
            "startRecord",
            "stopRecord",
            "onVoiceRecordEnd",
            "playVoice",
            "playVoice",
            "stopVoice",
            "onVoicePlayEnd",
            "startRecordVoiceBuffer",
            "onRecordBufferReceived",
            "stopRecordVoiceBuffer",
            "uploadVoice",
            "downloadVoice",
            "translateVoice",
            "setClipboardData",
            "getClipboardData",
          ];
          wx.config({
            beta: true,
            debug: false,
            appId: corpid,
            timestamp: "1626832073",
            nonceStr: nonceStr,
            signature: signature,
            jsApiList: jsApiList,
          });
        });
      },
      computed: {
        showDis() {
          return this.addedPreviewFile.length == 0 ? true : false;
        },
      },
      mounted() {
        this.batchId = this.getRandom();
      },
      methods: {
        //获取地理位置
        isLocationChange(e) {
          let _this = this;
          console.log("e", e, 445844);
          if (!_this.isLocation) {
            _this.coord = "";
            return;
          }
          wx.getLocation({
            type: "wgs84", // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
            success: function (res) {
              _this.coord =
                Number(res.longitude).toFixed(5) +
                "," +
                Number(res.latitude).toFixed(5);
              },
            fail: function (res) {
              console.log("getLocation end", res);
            },
          });
        },

        onOversize(file) {
          mui.toast("单张图片不能超过10MB", {
            duration: "long",
            type: "div",
          });
        },
        getRandom() {
          var arr = [
            "0",
            "1",
            "2",
            "3",
            "4",
            "5",
            "6",
            "7",
            "8",
            "9",
            "A",
            "B",
            "C",
            "D",
            "E",
            "F",
            "G",
            "H",
            "I",
            "J",
            "K",
            "L",
            "M",
            "N",
            "O",
            "P",
            "Q",
            "R",
            "S",
            "T",
            "U",
            "V",
            "W",
            "X",
            "Y",
            "Z",
            "a",
            "b",
            "c",
            "d",
            "e",
            "f",
            "g",
            "h",
            "i",
            "j",
            "k",
            "l",
            "m",
            "n",
            "o",
            "p",
            "q",
            "r",
            "s",
            "t",
            "u",
            "v",
            "w",
            "x",
            "y",
            "z",
          ];
          var str_nums = "";
          for (var i = 0; i < 32; i++) {
            var id = parseInt(Math.random() * (arr.length - 1));
            str_nums += arr[id];
          }
          return str_nums;
        },
        // 判断安卓还是ios
        compatibleInput() {
          //获取浏览器的userAgent,并转化为小写
          var ua = navigator.userAgent.toLowerCase();
          //判断是否是苹果手机，是则是true
          var isIos = ua.indexOf("iphone") != -1 || ua.indexOf("ipad") != -1;
          if (isIos) {
            this.isflageIOX = true;
          } else {
            this.isflageIOX = false;
          }
        },
        recordApprovaAfterRead(file) {
          if (file instanceof Array) {
            file.map((v) => {
              v.status = "uploading";
              v.message = "上传中...";
              this.recorUploadImg(v);
            });
          } else {
            file.status = "uploading";
            file.message = "上传中...";
            this.recorUploadImg(file);
          }
        },
        recorUploadImg(file) {
          var type = "ios";
          // if (this.isflageIOX) {
          //     type = 'ios'
          // } else {
          //     type = 'Android'
          // }
          if (sessionStorage.getItem("iscp_port")) {
            iscp_port = sessionStorage.getItem("iscp_port");
          } else {
            iscp_port = "";
          }

          let AuthenticationSession =
            sessionStorage.getItem("Authentication");
          var form = new FormData();
          // var form = new FormData($("#form-user")[0]);
          unitId = sessionStorage.getItem("unitId");
          userId = sessionStorage.getItem("userId");
          var timestamp = new Date().getTime() + ""; //时间戳
          form.append("userId", userId);
          form.append("file1", file.file);
          form.append("unitId", unitId);
          form.append("cellphone", type);
          form.append("batchId", this.batchId);
          let sign3 = sm3(timestamp + "&" + userId);
          //
          $.ajax({
            url: localUrlLink +
              iscp_port +
              "/photoTransfer/IdentificationFile/photoSend",
            // url: "http://172.20.10.5:19090/photoTransfer/IdentificationFile/photoSend",
            type: "post",
            // async: true, //是否同步，false表示同步请求
            // dataType: "json",
            data: form,
            cache: false,
            contentType: false,
            processData: false,
            headers: {
              // "Content-Type": "application/json;charset=UTF-8",
              sign: sign3,
              Authentication: AuthenticationSession,
              timestamp: timestamp,
              userId: userId,
            },
            success: (res, txt, xhr) => {
              if (sm3(res.resultValueStr) == xhr.getResponseHeader("sign")) {
                let Authentication = xhr.getResponseHeader("Authentication");
                if (res.code == 200) {
                  // mui.toast('上传成功', {
                  //     duration: 'long',
                  //     type: 'div'
                  // })
                  // this.batchId = res.resultValue.batchId
                  if (file instanceof Array) {
                    //判断是否是数组
                    file.map((v, i) => {
                      v.status = "success";
                      v.message = "";
                      v.id = res.resultValue.id;
                    });
                  } else {
                    file.status = "success";
                    file.message = "";
                    file.id = res.resultValue.id;
                  }
                } else {
                  file.status = "failed";
                  file.message = "上传失败";
                  file.id = ++this.num;
                  mui.toast(res.resultValue, {
                    duration: "long",
                    type: "div",
                  });
                }
              } else {
                file.status = "failed";
                file.message = "上传失败";
                file.id = ++this.num;
                mui.toast("完整性校验失败", {
                  duration: "long",
                  type: "div",
                });
              }
            },
            error: (e) => {
              file.status = "failed";
              file.message = "上传失败";
              file.id = ++this.num;
              mui.toast("请求异常请稍后再试", {
                duration: "long",
                type: "div",
              });
            },
          });
        },
        // 删除图片在服务器上删除
        recordApprovaUploadImg(item) {
          $(".curtain").css("display", "block");
          if (item.status == "failed") {
            this.formData = this.formData.filter((v) => v.id != item.id);
            $(".curtain").css("display", "none");
            mui.toast("删除图片成功", {
              duration: 1000,
              type: "div",
            });
            return;
          }
          let AuthenticationSession =
            sessionStorage.getItem("Authentication");
          if (sessionStorage.getItem("iscp_port")) {
            iscp_port = sessionStorage.getItem("iscp_port");
          } else {
            iscp_port = "";
          }
          let data = {
            ids: item.id,
            timestamp: new Date().getTime() + "", //时间戳
          };
          data = JSON.stringify(data);
          let sign = sm3(data);
          $.ajax({
            url: localUrlLink + iscp_port + "/photoTransfer/storage/deleteImage",
            // url: "http://172.20.10.5:19090/photoTransfer/storage/deleteImage",
            type: "post",
            // async: false, //是否同步，false表示同步请求
            dataType: "json",
            data: data,
            headers: {
              "Content-Type": "application/json;charset=UTF-8",
              Authentication: AuthenticationSession,
              sign: sign,
            },
            success: (res, txt, xhr) => {
              $(".curtain").css("display", "none");
              if (sm3(res.resultValueStr) == xhr.getResponseHeader("sign")) {
                let Authentication = xhr.getResponseHeader("Authentication");
                if (res.code == 200) {
                  if (Authentication) {
                    sessionStorage.setItem("Authentication", Authentication);
                    mui.toast("删除图片成功", {
                      duration: 1000,
                      type: "div",
                    });
                    this.formData = this.formData.filter(
                      (v) => v.id != item.id
                    );
                  }
                } else {
                  mui.toast(res.resultValue, {
                    duration: "long",
                    type: "div",
                  });
                }
              } else {
                mui.toast("完整性校验失败", {
                  duration: "long",
                  type: "div",
                });
              }
            },
            error: function (e) {
              $(".curtain").css("display", "none");
              mui.toast("请求异常请稍后再试", {
                duration: "long",
                type: "div",
              });
            },
          });
        },

        home() {
          $(location).attr("href", "Home.html?ssflag=ssflag");
        },
        sendEmail(id) {
          let text = id == 3 ? "是否同步至内网网站？" : "是否发送邮箱？"
          var btnArray = ["取消", "确定"];
          var i = 0;
          mui.confirm(text, "消息提醒", btnArray, (e) => {
            if (i > 0) return;
            i++;
            if (e.index == 1) {
              this.picEmail(id);
            }
          });
        },
        picEmail(id) {
          // if (this.isflageIOX) {
          //     let obj = this.formData.find(item => item.status == "uploading");
          //     let confirm = this.formData.some((item, index) => {
          //         return item.status == 'failed'; // 只要有一项数据失败状态
          //     })
          //     if (obj) {
          //         mui.toast('请上传完图片再试', {
          //             duration: 1000,
          //             type: 'div'
          //         })
          //         return
          //     }
          //     if (confirm) {
          //         mui.toast('请确认所有图片是否上传成功', {
          //             duration: 1000,
          //             type: 'div'
          //         })
          //         return
          //     }
          //     console.log(this.formData, this.formData.length, 111)
          //     if (this.formData.length == 0) {
          //         mui.toast('请上传图片', {
          //             duration: 1000,
          //             type: 'div'
          //         })
          //         return
          //     }
          // } else { //安卓的判断逻辑
          if (this.addedPreviewFile.length == 0) {
            mui.toast("请上传图片", {
              duration: 1000,
              type: "div",
            });
            return;
          }
          // }  
          toMail = sessionStorage.getItem("toMail");
          // 发送邮箱前判断是否注册过
          if (!toMail && id == 0) {
            $(".curtain").css("display", "none");
            mui.toast("请前往“我的”页面设置内网邮箱！", {
              duration: "long",
              type: "div",
            });
            return;
          }
          $(".curtain").css("display", "block");
          userId = sessionStorage.getItem("userId");
          orgId = sessionStorage.getItem("unitId");
          if (sessionStorage.getItem("iscp_port")) {
            iscp_port = sessionStorage.getItem("iscp_port");
          } else {
            iscp_port = "";
          }
          var timestamp = new Date().getTime() + "";
          let waterMark = this.isWatermark ? "1" : "0";
          let isPdf = this.isPdf ? "1" : "0";
          let data = {
            timestamp: timestamp,
            orgId: orgId, //单位id
            userId: userId,
            saveType: id,
            batchId: this.batchId,
            coord: this.coord,
            isWatermark: waterMark,
            isPdf: isPdf,
          };
         
          data = JSON.stringify(data);
          let sign = sm3(data);
          let resResult;
          let AuthenticationSession =
            sessionStorage.getItem("Authentication");
          setTimeout(() => {
            $.ajax({
              url: localUrlLink +
                iscp_port +
                "/photoTransfer/email/photoSendEmail",
              // url: "http://172.20.10.5:19090/photoTransfer/email/photoSendEmail",
              type: "post",
              // async: true, //是否同步，false表示同步请求
              dataType: "json",
              data: data,
              headers: {
                "Content-Type": "application/json;charset=UTF-8",
                Authentication: AuthenticationSession,
                sign: sign,
                timestamp: timestamp,
              },
              success: (res, txt, xhr) => {
                $(".curtain").css("display", "none");
                if (sm3(res.resultValueStr) == xhr.getResponseHeader("sign")) {
                  let Authentication =
                    xhr.getResponseHeader("Authentication");
                  if (res.code == 200) {
                    if (Authentication) {
                      sessionStorage.setItem(
                        "Authentication",
                        Authentication
                      );
                      if (id == 3) {
                        showConfirmDialog("同步完成，请及时到内网网站aioa.sgcc.com.cn下载使用"," ")
                      } else {
                        mui.toast("发送成功，请在内网邮箱中查收", {
                          duration: "long",
                          type: "div",
                        });
                      }

                      this.formData = [];
                      this.addedPreviewFile = [];
                      this.batchId = this.getRandom();
                      addOperator(
                        6,
                        this.getAValue(),
                        "发送图片",
                        1,
                        1,
                        "发送图片成功",
                        "",
                        "picture"
                      );
                    }
                    // this.disabled = true
                    // setTimeout(() => {
                    //     this.home()
                    // }, 1500)
                  } else if (res.code == 500) {
                    if (id == 3) {
                      syncToast('同步失败', 1500, "error", true)
                    } else {
                      mui.toast(res.resultValue, {
                        duration: "long",
                        type: "div",
                      });
                    }

                    addOperator(
                      6,
                      this.getAValue(),
                      "发送图片",
                      1,
                      0,
                      "发送图片失败",
                      "",
                      "picture"
                    );
                  } else {
                    mui.toast("请求异常,请稍后再试", {
                      duration: 1000,
                      type: "div",
                    });
                    addOperator(
                      6,
                      this.getAValue(),
                      "发送图片",
                      1,
                      0,
                      "发送图片失败",
                      "",
                      "picture"
                    );
                  }
                } else {
                  mui.toast("完整性校验失败", {
                    duration: 1000,
                    type: "div",
                  });
                  addOperator(
                    6,
                    this.getAValue(),
                    "发送图片",
                    1,
                    0,
                    "发送图片失败",
                    "",
                    "picture"
                  );
                }
              },
              error: (e) => {
                $(".curtain").css("display", "none");
                addOperator(
                  6,
                  this.getAValue(),
                  "发送图片",
                  1,
                  0,
                  "发送图片失败",
                  "",
                  "picture"
                );
                mui.toast("请求异常,请稍后再试", {
                  duration: 1000,
                  type: "div",
                });
              },
            });
          }, 100);
        },
        getAValue() {
          let value = 0;
          if (this.isLocation) {
            value |= 1;
          }
          if (this.isWatermark) {
            value |= 2;
          }
          if (this.isPdf) {
            value |= 4;
          }

          switch (value) {
            case 7: //，表示都有
              return '1,2,3';
            case 3: //，表示有坐标和水印
              return '1,2';
            case 5: //，表示有坐标和合成
              return '1,3';
            case 6: //，表示有水印和合成
              return '2,3';
            case 1: //，表示只有坐标
              return '1';
            case 2: //，表示只有水印
              return '2';
            case 4: //，表示只有合成
              return '3';
            default:
              return '0';
          }
        },
        //安卓手机对应的js逻辑

        //  、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
        delImg(index) {
          // 1: 取要删除的id
          const delid = this.addedPreviewFileIds[index];
          // 删除addedPreviewFile index
          this.delfile(delid, index);
        },
        delfile(id, index) {
          let AuthenticationSession =
            sessionStorage.getItem("Authentication");
          if (sessionStorage.getItem("iscp_port")) {
            iscp_port = sessionStorage.getItem("iscp_port");
          } else {
            iscp_port = "";
          }
          let data = {
            ids: id,
            timestamp: new Date().getTime() + "", //时间戳
          };
          data = JSON.stringify(data);
          let sign = sm3(data);
          $.ajax({
            url: localUrlLink + iscp_port + "/photoTransfer/storage/deleteImage",
            // url: "http://172.20.10.5:19090/photoTransfer/storage/deleteImage",
            type: "post",
            async: false, //是否同步，false表示同步请求
            dataType: "json",
            data: data,
            headers: {
              "Content-Type": "application/json;charset=UTF-8",
              Authentication: AuthenticationSession,
              sign: sign,
            },
            success: (res, txt, xhr) => {
              if (sm3(res.resultValueStr) == xhr.getResponseHeader("sign")) {
                let Authentication = xhr.getResponseHeader("Authentication");
                if (res.code == 200) {
                  if (Authentication) {
                    sessionStorage.setItem("Authentication", Authentication);
                    //    成功
                    mui.toast(res.resultValue, {
                      duration: 1000,
                      type: "div",
                    });
                    this.addedPreview.splice(index, 1);
                    this.addedPreviewFile.splice(index, 1);
                    this.addedPreviewFileIds.splice(index, 1);
                  }
                } else {
                  mui.toast(res.resultValue, {
                    duration: "long",
                    type: "div",
                  });
                }
              }
            },
            error: function (e) {
              $(".curtain").css("display", "none");
              mui.toast("请求异常请稍后再试", {
                duration: "long",
                type: "div",
              });
            },
          });
        },
        // 点击上传照片逻辑
        functionBtn() {
          var count = 9 - this.addedPreviewFile.length;
          var count1 = "";
          if (count < 9) {
            count1 = 9 - this.addedPreviewFile.length;
          } else {
            count1 = 9;
          }
          wx.chooseImage({
            count: count1, // 默认9
            sizeType: ["original"], // 可以指定是原图还是压缩图，默认二者都有
            sourceType: ["album", "camera"], // 可以指定来源是相册还是相机，默认二者都有
            quality: 1, //压缩质量，范围0～1，数值越小，质量越低，压缩率越高（仅对jpg有效）
            success: (res) => {
              // var localIds = res.localIds[0]; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
              this.slocalResPath = [];
              $(".curtain").css("display", "block");
              var exists = this.addedPreviewFile.length;
              // 先把数组长度固定
              this.addedPreview.length = exists + res.localIds.length;
              this.loopList(res.localIds, exists, 0);
            },
          });
        },
        loopList(localIds, exists, index) {
          var loid = localIds[index];
          wx.invoke(
            "getLocalResPath", {
              localId: loid,
            },
            (res) => {
              this.slocalResPath.push({
                path: res.localResPath
              });
              this.getImage(res.localResPath, exists + index, loid, () => {
                if (index === localIds.length - 1) {
                  if (this.isflageIOX) {
                    this.checkList("ios");
                  } else {
                    this.checkList("Android");
                  }
                } else {
                  this.loopList(localIds, exists, index + 1);
                }
              });
            }
          );
        },
        getImgBase(localIds, index, callback, slocalResPath, size) {
          var a = false;
          // 根据id取图片的路径
          wx.getLocalImgData({
            localId: localIds,
            success: (res) => {
              var localData = res.localData;
              if (localData.indexOf("data:image") != 0) {
                //判断是否有这样的头部
                localData = "data:image/jpeg;base64," + localData;
              }
              localData = localData
                .replace(/\r|\n/g, "")
                .replace("data:image/jpg", "data:image/jpeg");
              // 第一个替换的是换行符，第二个替换的是图片类型，因为在IOS机上测试时看到它的图片类型时jgp，
              // 这不知道时什么格式的图片，为了兼容其他设备就把它转为jpeg
              this.addedPreview[index] = {
                localDatas: localData,
                path: slocalResPath,
                size: size
              }; // 返回图片的服务器端ID
              // ios单独添加文件用来回显
              this.slocalResPath.forEach(el => {
                if (el.path == slocalResPath) el.file = localData
              });
              // console.log('getImgBase',this.addedPreview)
              callback();
            },
          });
        },
        createNonceStr(len) {
          var e = len ? len : 16;
          var t =
            "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",
            a = t.length,
            n = "";
          for (i = 0; i < e; i++)
            n += t.charAt(Math.floor(Math.random() * a));
          return n;
        },

      
        async checkList(ios) {
          if (sessionStorage.getItem("iscp_port")) {
            iscp_port = sessionStorage.getItem("iscp_port");
          } else {
            iscp_port = "";
          }

          const userId = sessionStorage.getItem("userId");
          const orgId = sessionStorage.getItem("unitId");
          const regEx = ".+/(.+)$";
          var datas = {
              cellphone: ios,
              orgId: orgId,
              userId: userId,
              batchId: this.batchId,
              files: {},
            },
            file = {};
          // 遍历img数组 单张上传图片
          for (let i = 0; i < this.slocalResPath.length; i++) {
            datas.filename1 = this.slocalResPath[i].path.match(regEx)[0];
            datas.originalname1 = this.slocalResPath[i].path.match(regEx)[0];
            datas.files.file1 = this.slocalResPath[i].path;
            try {
              const resultValue = await this.extNetUpload(datas);

              if (sm3(resultValue.id) == resultValue.sign) {
                let Authentication = resultValue.Authentication;
                if (Authentication) {
                  sessionStorage.setItem("Authentication", Authentication);
                  // this.batchId = resultValue.batchId
                  ids = resultValue.id.split(",");
                  if (
                    !this.addedPreviewFileIds ||
                    this.addedPreviewFileIds.length == 0
                  ) {
                    this.addedPreviewFileIds = [...ids];
                  } else {
                    this.addedPreviewFileIds = [
                      ...this.addedPreviewFileIds,
                      ...ids,
                    ];
                  }
                  // this.addedPreviewFile = [];
                  // if (!this.addedPreviewFile.length) {
                  //   this.addedPreviewFile = this.addedPreview;
                  // } else {
                  //   this.addedPreview.forEach((item) => {
                  //     this.addedPreviewFile.push(item);
                  //   });
                  // }
                  // if(this.isflageIOX){
                  //   this.addedPreviewFile.push(this.slocalResPath[i].file)
                  // }else{
                  //   this.addedPreviewFile.push(this.slocalResPath[i].path)
                  // }

                  this.addedPreviewFile.push({
                    localDatas: this.isflageIOX ? this.slocalResPath[i].file : this.slocalResPath[i].path
                  })
                }
              } else {
                mui.toast("完整性校验失败", {
                  duration: "long",
                  type: "div",
                });
              }
              // console.log('success', res)
            } catch (error) {
              // 删掉数组中上传失败的图片
              this.addedPreview = this.addedPreview.filter(el => el.localDatas != this.slocalResPath[i]);

              mui.toast(`上传失败，请稍后再试！`, {
                duration: "long",
                type: "div",
              });
            }
          }
          $(".curtain").css("display", "none");
        },
        extNetUpload(datas) {
          return new Promise((resolve, reject) => {
            var channelId = "net_upload_" + this.createNonceStr(8);
            const timestamp = new Date().getTime() + "";
            let signTime = sm3(timestamp + "&" + datas.userId);
            let AuthenticationSession =
              sessionStorage.getItem("Authentication");
            var param = {
              id: channelId,
              timeout: "60",
              url: localUrlLink +
                iscp_port +
                "/photoTransfer/IdentificationFile/photoSend",
              header: {
                "Content-Type": "application/json;charset=UTF-8",
                sign: signTime,
                Authentication: AuthenticationSession,
                timestamp: timestamp,
                userId: datas.userId,
              },
              data: datas,
              files: datas.files,
            };
            wx.invoke(
              "ext_Net_Upload", {
                data: param,
              },
              (res) => {
                res.datas = datas
                if (res.err_msg.endsWith(":ok")) {
                  //成功结果
                  const result = JSON.parse(res.result);
                  if (result.code == 200) {
                    return resolve(result.resultValue);
                  }
                  return reject(result);
                }
                return reject(res);
              }
            );
          });
        },
        getImage(slocalResPath, index, localIds, callback) {
          wx.invoke(
            "ext_FileManager_Information", {
              data: {
                path: slocalResPath,
              },
            },
            (res) => {
              let str = JSON.parse(res.data);
              str = str.fileSize.split(".");
              if (str[1].indexOf("MB") !== -1) {
                if (Number(str[0]) >= 10) {
                  $(".curtain").css("display", "none");
                  mui.toast("图片大小不能超过10MB", {
                    duration: "long",
                    type: "div",
                  });
                  this.addedPreview.length--;
                  return;

                  // this.addedPreview[index] = {
                  //   error: '图片大小不能超过15MB'
                  // }
                  // callback()
                } else {
                  if (this.isflageIOX) {
                    this.getImgBase(localIds, index, callback, slocalResPath, Number(str[0]));
                  } else {
                    this.addedPreview[index] = {
                      localDatas: slocalResPath,
                      size: Number(str[0]),
                    };
                    callback();
                  }
                  // callback()
                  // this.getImgBase(localIds, index, callback);
                }
              } else {
                if (this.isflageIOX) {
                  this.getImgBase(localIds, index, callback, slocalResPath, 1);
                } else {
                  this.addedPreview[index] = {
                    localDatas: slocalResPath,
                    size: 1,
                  };

                  callback();
                }
                // callback()
                // this.getImgBase(localIds, index, callback);
              }
            }
          );
        },
      },
    });
  </script>
</body>

</html>